<template>
  <div class="privilege">
    <van-nav-bar title="我的优先购买码" left-arrow @click-left="onClickLeft" />

    <van-tabs v-model="active">
      <van-tab title="可使用">
          <van-cell v-for="(v,i) in list" :key="i" class="cods" :title="v.name" :value="v.value" :label="v.info" />
        <van-empty v-if="show"
          class="custom-image"
          image="	https://m.xiaomiyoupin.com/youpin/static/m/res/images/no_result/no_result_order_gray.png"
          description="暂无数据" /><recommend
      /></van-tab>
      <van-tab title="已分享">
        <van-empty
          class="custom-image"
          image="	https://m.xiaomiyoupin.com/youpin/static/m/res/images/no_result/no_result_order_gray.png"
          description="暂无数据" /><recommend
      /></van-tab>
      <van-tab title="已失效">
        <van-empty
          class="custom-image"
          image="	https://m.xiaomiyoupin.com/youpin/static/m/res/images/no_result/no_result_order_gray.png"
          description="暂无数据" />
        <recommend
      /></van-tab>
    </van-tabs>
  </div>
</template>

<script>
import axios from 'axios';
import recommend from "./components/Recommend.vue";
export default {
  name: "privilege",
  data() {
    return {
      active: 0,
      list:[]
    };
  },
  computed: {
    show(){
      if(this.list .length == 0){
        return true;
      }
      return false;
    }
  },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
  },
  components: {
    recommend,
  },
  created() {
    axios({
      method:'get',
      url: "/cods",
    }).then(res => {
      this.list = res.data
    })
  },
};
</script>
<style  scoped>
.cods {
  margin-top: .1rem;
}
</style>
<style>
</style>

